<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"   
      xmlns:ui="http://java.sun.com/jsf/facelets"
>
    <body>
        <ui:composition>
            <div id="content_left">
                <div class="content_left_section">
                    <h1>Categories</h1>
                    <ui:repeat value="#{categoryRequest.listCategory}" var="b">
                        <ul>
                            <li><a href="http://www.free-css.com/">#{b.toUpperCase()}</a></li>
                        </ul>
                    </ui:repeat>
                </div>
                <div class="content_left_section"> <a href="http://validator.w3.org/check?uri=referer"><img style="border:0;width:88px;height:31px" src="http://www.w3.org/Icons/valid-xhtml10" alt="" width="88" height="31" vspace="8" border="0" /></a> <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px"  src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="" vspace="8" border="0" /></a> </div>
            </div>
            <!-- end of content left -->
            <div id="content_right">
                <ui:repeat value="#{bookRequest.listBook}" var="b">
                    <div class="product_box">
                        <h1>#{b.name}</h1>
                        <img src="#{b.images}" alt="" />
                        <div class="product_info">
                            <b>Author:</b><h3>#{b.author}</h3>
                            <b>Price:</b><h3>#{b.price} $</h3>
                            <div class="buy_now_button"><a href="http://www.free-css.com/">Buy Now</a></div>
                            <div class="detail_button"><a href="http://www.free-css.com/">Detail</a></div>
                        </div>
                        <div class="cleaner">&nbsp;</div>
                    </div>
                </ui:repeat>
                <div class="cleaner_with_height">&nbsp;</div>
                <a href="http://www.free-css.com/"><img src="images/ads.jpg" alt="ads" /></a>
            </div>
            <!-- end of content right -->
            <div class="cleaner_with_height">&nbsp;</div>
        </ui:composition>
    </body>
</html>